<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>填写订单</title>
  <!-- 引入css初始化文件 -->
  <link rel="stylesheet" href="./css/normalize.css">
  <!-- 引入order.css -->
  <link rel="stylesheet" href="./css/order.css">
  <!-- 引入字体图标 -->
  <link rel="stylesheet" href="./lib/iconfont/iconfont.css">
</head>

<body>
  <!-- 主体 start -->
  <div class="main">
    <!-- 用户信息模块 -->
    <div class="order-msg">
      <div class="location iconfont icon-location">
      </div>
      <div class="msg">
        <div class="user-info">
          林丽 <span>18500667882</span>
        </div>
        <div class="address">北京市 海淀区 中关村软件园 信息科技大厦1号
          楼410#</div>
      </div>
      <a href="#" class="more iconfont icon-more"></a>
    </div>
    <!-- 商品信息模块 -->
    <div class="goods">
      <div class="pic">
        <img src="./uploads/pic.png" alt="">
      </div>
      <div class="info">
        <h4>康尔贝 非接触式红外体温仪 <br>
          领券立减30元 婴儿级材质 测温…</h4>
        <p>粉色 红外体温计</p>
        <div>
          <span class="price">¥<em>266</em></span>
          <del>¥299</del>
        </div>
      </div>
      <div class="count"> <i class="iconfont icon-x"></i>1</div>
    </div>
    <!-- 配送模块 panel 面板 -->
    <div class="panel">
      <div class="express">
        <p>配送方式</p>
        <p>顺丰快递</p>
      </div>
      <div class="remark">
        <p>买家备注</p>
        <div class="message">希望可以尽快发货，谢谢~</div>
      </div>
      <div class="payment">
        <p>支付方式</p>
        <p>支付宝 <i class="iconfont icon-more"></i> </p>
      </div>
    </div>
    <!-- 快递 -->
    <div class="panel">
      <div class="express">
        <p>商品总价</p>
        <p>￥299.00</p>
      </div>
      <div class="remark">
        <p>运费</p>
        <p>￥0.00</p>
      </div>
      <div class="payment">
        <p>折扣</p>
        <p>-￥30.00 </p>
      </div>
    </div>
  </div>
  <!-- 主体 end -->




  <!-- 底部支付 start -->
  <div class="pay-order">
    <div class="sum">
      <p>合计：</p>
      <div>￥<span>266.00</span></div>
    </div>
    <div class="pay">
      <a href="#">去支付</a>
    </div>
  </div>
  <!-- 底部支付 end -->

</body>

</html>